<template>
  <div style="display: inline;">
    <span @click="dialogVisible = ( true && isShow )">{{name}}</span>
    <el-dialog
      :visible.sync="dialogVisible"
      width="800px"
      center>
      <p v-html="context" class="context"></p>
      <div slot="footer" class="dialog-footer">
        <!--<el-button @click="dialogVisible = false">同 意</el-button>-->
        <el-button style="width: 200px" @click="agreed">同 意</el-button>
      </div>

    </el-dialog>

  </div>


</template>
<script>
  import {agreement} from '@/api/account/cms'
  export default {
    data() {
      return {
        context :'',
        dialogVisible:false
      };
    },
    props:{
      name:{
        type: String,
        default: ""
      },
      code:{
        type: String,
        default: ""
      },
      isShow: {
        type: Boolean,
        default: true
      }
    },
    mounted() {
      let _this = this;
      agreement(_this._props.code).then(data => {
        _this.context = data;
      })
    },
    methods:{
      agreed(){
        this.dialogVisible = false;
        this.$emit('childEvent', { result: '1'});
      }
    }
  };
</script>
<style lang="scss">
  .context{
    line-height: 22px;
    white-space: pre-wrap;
    *{margin:0;padding:0}
    li{list-style:none}
    img{vertical-align:top;border:none}
  }
</style>
